<template>
	<el-col :span="24" class="footer">
		<div class="footer-main">
			<div class="main-left">
				<div class="left">
					<el-breadcrumb separator="|" class="tabs">
					  <el-breadcrumb-item :to="{ path: '/sy' }">首页</el-breadcrumb-item>
					  <el-breadcrumb-item :to="{ path: '/production' }">产品功能</el-breadcrumb-item>
					  <el-breadcrumb-item :to="{ path: '/cooperation' }">渠道合作</el-breadcrumb-item>
					  <el-breadcrumb-item :to="{ path: '/aboutUs' }">关于我们</el-breadcrumb-item>
					</el-breadcrumb>
					<div class="left-bottom">
						<!-- <i></i> -->
						<div class="kefu">
							<div>客服电话：<span class="tel">010-62698511</span></div>
							<div style="margin-bottom: 20px;">微信客服：yhkjedu</div>
							<div style="margin-bottom: 20px;">友情链接：<a href="https://www.tech.net.cn/" target="_blank">中国高职高专教育网</a><a href="http://zyk.ouchn.cn" target="_blank">职业教育专业教学资源库</a><a href="https://www.enetedu.com/" target="_blank">全国高校教师网络培训中心</a></div>
							<!-- <div style="margin-bottom: 20px;">@ Copyright北京永恒信业教育科技有限公司 .版权所有   <a href="https://beian.miit.gov.cn/#/Integrated/recordQuery?host=yhycr.com" target="_blank">京ICP备20011758号-7</a></div> -->
						</div>
					</div>
				</div>
				<div class="right">
					<div class="code">
						<el-image src="/static/image/index/logo_yhgzh.png" class="logo-img"></el-image>
						<span>扫码关注</span>
						<span>永恒云课堂</span>
					</div>
					<div class="code">
						<el-image src="/static/image/index/yhxcx.png" class="logo-img"></el-image>
						<span>扫码进入</span>
						<span>永恒云课堂小程序</span>
					</div>
				</div>
			</div>
			
			<el-divider ></el-divider>
			<div class="jg">@ Copyright北京永恒信业教育科技有限公司 .版权所有 .版权所有 京ICP备20011758号-7</div>
		</div>
	</el-col>
</template>

<script>
	export default {
		data() {
			return {
			}
		},
		methods: {}
	}
</script>

<style lang="scss" scoped>
	
	.footer{
		box-sizing: border-box;
		background-color: #393f50;
		.footer-main{
			.main-left{
				display: flex;
				align-items: center;
				justify-content: space-between;
				box-sizing: border-box;
				// width: 200px;
				// height: 180px;
				padding: 25px 10%;
				.left{
					margin-top: 39px;
					.left-bottom{
						margin-top: 20px;
						display: flex;
						color: #fff;
						// height: 40px;
						i{
							display: block;
							width: 3px;
							height: 100%;
							background-color: #5b90ff;
						}
						.kefu{
							display: flex;
							flex-direction: column;
							align-content: space-around;
							justify-content: flex-start;
							
							a{
								font-size: 13px;
								color: #fff;
								margin-right: 10px;
							}
						}
					}
				}
				.right{
					padding-top: 20px;
					display: flex;
					.code{
						display: flex;
						flex-direction: column;
						align-items: center;
						justify-content: center;
						color: #fff;
						margin-right: 20px;
					}
				}
			}
			.tabs{
				&>>>.el-breadcrumb__inner{
					color: #fff;
				}
			}
			.jg{
				text-align: center;
				color: #647184;
				padding-bottom: 10px;
			}
		}
		
	}
	.logo-img{
		width: 114px;
		height: 114px;
	}
	.tabs>>>.el-breadcrumb__item:last-child .el-breadcrumb__inner{
		font-weight: bold !important;
		cursor: pointer !important;
	}
	.el-divider{
		background-color: #515050;
		margin: 0 0 10px 0;
	}
</style>
